import React, {useEffect, useState} from 'react';
import {history, connect, SelectLang } from 'umi';
import Avatar from './AvatarDropdown';
import HeaderSearch from '../HeaderSearch';
import styles from './index.less';
import NoticeIconView from './NoticeIconView';
import {Button} from "antd";

const GlobalHeaderRight = (props) => {
    const {theme, layout, currentUser = {
        avatar: '',
        nickname: '',
    }, route} = props;

    const {module} = route && route['/'] || '';

    let className = styles.right;

    if (theme === 'dark' &&  layout === 'top') {
        className = `${styles.right}  ${styles.dark}`;
    }
  const search = (pathname = '/search', value) => {
    const data = {wd: value};
    const path = {
      pathname,
      state: data,
    };
    history.push(path);
    }

    return (
        <div className={className}>
            <HeaderSearch
                className={`${styles.action} ${styles.search}`}
                placeholder="站内搜索"
                defaultValue="年谱"
                options={[
                    {
                        label: <a onClick={() => search('/search', '年谱')}
                                  href="#">年谱</a>,
                        value: '年谱',
                    },
                    {
                        label: <a onClick={() => search('/search', '技术')}
                                  href="#">技术</a>,
                        value: '技术',
                    },
                    {
                        label: <a onClick={() => search('/search', '信息')}
                                  href="#">信息</a>,
                        value: '信息',
                    },
                ]}
                onSearch={value => search(`/search`, value)}
            />
            {
                currentUser?.nickname ? (<NoticeIconView/>) : ('')
            }
            <Avatar menu/>
            <SelectLang className={styles.action} />
          {module === 'category' && <span className={styles.action}>
                <Button
                    type="primary"
                    shape="round"
                    size="small"
                    href="/info/pub/create"
                >发布信息</Button>
            </span>}
        </div>
    )
}

export default connect(({ user, settings }) => ({
  currentUser: user.currentUser,
  route: user.route,
  theme: settings.navTheme,
  layout: settings.layout,
}))(GlobalHeaderRight);
